<template>
    <div class="commentIitem-container">
        <h3>{{commentObj.username}}说:</h3>
        <p>{{commentObj.comment}}</p>
        <button class="remove-button" @click="$EventBus.$emit('removeCommentItem',commentObj.id)">删除</button>
    </div>
</template>

<script>
export default {
    name: 'CommentItem',
    props: ['commentObj']
}
</script>

<style>
  .commentIitem-container{
    position: relative;
    width: 500px;
    border: 1px solid #ccc;
    border-radius: 10px;
  }
  p{
    text-indent: 4em;
  }
  .remove-button{
    position: absolute;
    top: 0;
    right: 0;
  }
</style>